<!--
 * @Author: 悦者生存 1002783067@qq.com
 * @Date: 2023-03-11 11:48:40
 * @LastEditors: 悦者生存 1002783067@qq.com
 * @LastEditTime: 2023-10-09 22:56:09
 * @FilePath: /koa2-ts-template/src/views/index.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <h1>koa2 upload demo</h1>
    <p>file upload</p>
    <span>picName:</span><input name="picName" type="text" /><br />
    <input name="file" type="file" id="file" /><br /><br />
    <button type="button" id="submit">submit</button>
  </body>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
  <script>
    let file;
    $('#submit').click(() => {
      upload();
    });

    document.getElementById('file').addEventListener('change', function (e) {
      file = this.files[0];
    });

    function upload() {
      const data = new FormData();
      data.append('file', file);
      fetch('/api/upload', {
        method: 'POST',
        body: data,
      })
        .then((response) => response.json())
        .then((data) => {
          console.log(data);
        });
    }
  </script>
</html>
